
$formGroupHeight:		(s:30px,m:50px)!default;
$fromGroupFontSize:		(s:12px,m:14px)!default;
$fromGroupBorderColor:   $border-color!default;

.from-group-wrapper{
	padding:20px 15px;
}
.form-group{
	position: relative;
	margin-top:20px;
	&:after{
		content:"";
		@include retina-one-px-border(bottom,$fromGroupBorderColor)
	}

	.control-label {
		font-size:12px;
		color:$gray;
		white-space:nowrap;
	}
	.control-labe-m{
		width:90px;
	}

	.form-control{
		height:map-get($formGroupHeight,s);
		line-height: 25px;
		display:block;
		border:none;
		padding:0;
		margin:0;
		font-size:map-get($fromGroupFontSize,s);
		@include placeholder($gray);
	}

	.form-control-padding{
		padding:0 20px;
	}
	.form-control-xs{
		display:inline-block;
		width:55px!important;
	}

	&.form-group-flex{
		@include equal-flex(".form-control");
		align-items:center;
	}

	&.form-group-require{
		&:before{
			content:"*";
			margin-right: 10px;
			margin-top: 5px;
			color:$red;
		}
		&.error{
			&:before{
				background-color:$red;
			}
			.form-control{
				@include placeholder($red);
			}
		}
	}

	&.form-group-blank{
		&:before{
			content:"";
			width:6px;
			margin-right: 10px;
		}
	}

	&.form-group-right-blank{
		.form-control{
			padding-right: 4.8vw;
		}
	}

	&.form-group-text{
		.form-label{
			display:block;
			font-size:12px;
			color:$gray;
			margin-bottom: 5px;
		}
		.form-text{
			font-size:16px;
			padding-bottom:25px;
		}
		.form-img{
			border:1px solid $fromGroupBorderColor;
			padding:10px;
			img{
				display:block;
				width:100%;
				height:auto;
			}
		}
	}
	&.form-group-text:last-child{
		&:after{
			display:none;
		}
	}
}

.form-group-lg{
	margin-top:10px;
	.form-control{
		height:map-get($formGroupHeight,m);
		font-size:map-get($fromGroupFontSize,m);
	}
}

.agree-terms{
	color:$gray;
	@include equal-flex(".text");
	.icon-checkbox{
		margin-right: 15px;
		margin-top: 2px;
	}
}
